<template>
  <div class="login">
    <i class="logo"></i>
    <section class="main">
      <h4 class="title">登录</h4>
      <el-form :model="login" status-icon :rules="rules" ref="login">
        <el-form-item prop="username">
          <el-input type="password" v-model="login.username" auto-complete="off" placeholder="公司邮箱"></el-input>
        </el-form-item>
        <el-form-item prop="password">
          <el-input type="password" v-model="login.password" auto-complete="off" placeholder="输入密码" @keyup.enter.native="submitLogin()"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" class="btn-line" @keyup.13.native="submitLogin()" @click="submitLogin">提交</el-button>
        </el-form-item>
      </el-form>
      <h6 class="desc">本系统由vx团队提供</h6>
    </section>
  </div>
</template>

<script>
  import axios from 'axios'
  import qs from 'qs'
  export default {
    name: "Login",
    data(){
      return {
        login: {
          username: '',
          password: ''
        },
        rules: {
          username: [
            { required: true, message: '用户名不能为空' }
          ],
          password: [
            { required: true, message: '密码不能为空' }
          ]
        }
      }
    },
    methods: {
      submitLogin () {
        this.$refs.login.validate(valid => {
          if (valid) {
            let form = qs.stringify(this.login)
            axios.post('/users/login',form).then((res)=>{
              if(res.data.status=="0"){
                let consumer = res.data.consumer
                sessionStorage.setItem('_user_info_',res.data.username)
                sessionStorage.setItem('_consumer_info_',consumer)
                sessionStorage.setItem('_isAddAccess_',res.data.addAccess)
                sessionStorage.setItem('_isDeleteAccess_',res.data.deleteAccess)
                sessionStorage.setItem('_isUpdateAccess_',res.data.updateAccess)
                sessionStorage.setItem('_isFindAccess_',res.data.findAccess)
                this.$router.push({name:'personal',params:{consumer:consumer}})
              }else if(res.data.status=='2'){
                this.$message({
                  type: 'info',
                  message: "用户不存在"
                })
              }else if(res.data.status=='3'){
                this.$message({
                  type: 'error',
                  message: "用户密码错误"
                })
              }else{
                alert('服务器正忙，请稍后重试！')
              }
            })
          } else {
            return false;
          }
        })
      }
    }
  }
</script>
